
.crumb {
    border-bottom: 1px solid #eaeaea;
    color: #5c5c5c;
    font-size: 18px;
    height: 30px;
    padding-top: 22px;
    margin-bottom: 20px;
}

#content .center-align #left {
    padding-bottom: 30px;
}

#content form.settings div.tr {
    min-height: 40px;
}

#content form.settings div.th {
    color: #5c5c5c;
    float: left;
    font-size: 14px;
    height: 40px;
    line-height: 40px;
    text-align: right;
    width: 95px;
}

#content form.settings div.td {
    border: 0px solid transparent;
    color: #999999;
    float: left;
    font-size: 14px;
    min-height: 40px;
    line-height: 40px;
    text-align: left;
    width: 435px;
}

#content form.settings .text-wrapper {
    background: #eaeaea;
    height: 30px;
    line-height: 33px;
    margin-top: 3px;
}

#content form.settings .birthday .text-wrapper,
#content form.settings .gender .text-wrapper {
    *background: transparent;
    *margin-top: 5px;
    _margin-top: 12px;
}

#content form.settings .text-wrapper select,
#content form.settings .text-wrapper textarea,
#content form.settings .text-wrapper input {
    background: transparent;
    border: 0px solid transparent;
    color: #999999;
    font-size: 14px;
    -webkit-appearance: textfield;
}

#content form.settings .error {
    color: #FC5D7B;
    margin-left: 10px;
}

#content form.basic-info .unverified {
    color: #FC5D7B;
    margin-left: -3px;
}

#content form.basic-info .gender .text-wrapper {
    width: 92px;
}

#content form.basic-info .gender .text-wrapper select {
    padding-left:40px;
    width: 90px;
}

#content form.basic-info .birthday .date-label {
    text-align: center;
    width: 32px;
}

#content form.basic-info .birthday .text-wrapper.year {
    width: 100px;
    padding-left: 10px;
    *padding: 0;
}

#content form.basic-info .birthday .text-wrapper.year select {
    padding-left: 27px;
    width: 95px;
}

#content form.basic-info .birthday .text-wrapper.month {
    width: 68px;
    padding-left: 10px;
}

#content form.basic-info .birthday .text-wrapper.month select {
    padding-left: 25px;
    width: 65px;
}

#content form.basic-info .birthday .text-wrapper.day {
    width: 68px;
    padding-left: 10px;
}

#content form.basic-info .birthday .text-wrapper.day select {
    padding-left: 25px;
    width: 65px;
}

#content form.basic-info .email .text-wrapper {
    width: 330px;
}

#content form.basic-info .email .text-wrapper input {
    width: 320px;
    padding-left: 10px;
}

#content form.basic-info .website .text-wrapper {
    width: 330px;
}

#content form.basic-info .website .text-wrapper input {
    width: 320px;
    padding-left: 10px;
}

#content form.basic-info .custom-url .text-wrapper {
    width: 82px;
    float: left;
}

#content form.basic-info .custom-url .text-wrapper input {
    width: 62px;
    padding-left: 10px;
}

#content form.basic-info .custom-url-hint .td {
    font-size: 11px;
    line-height: 20px;
}

#content form.basic-info .bio .text-wrapper {
    height: 125px;
    width: 380px;
}

#content form.basic-info .bio .text-wrapper textarea {
    background: transparent;
    border: 0 solid transparent;
    height: 115px;
    margin: 2px;
    resize: none;
    padding: 2px 10px;
    width: 355px;
    overflow: hidden;
}

#content form.settings input#update {
    background: #4abdcc;
    border: 0px solid transparent;
    color: #ffffff;
    cursor: pointer;
    font-size: 14px;
    height: 32px;
    margin-top: 10px;
    text-shadow: 1px 1px 1px #5c5c5c;
    width:96px;
}

#content form.settings input#update:hover {
    background: #2e9dab;
}

#content form.change-username .text-wrapper,
#content form.fill-profile .text-wrapper,
#content form.change-password .text-wrapper {
    width: 250px;
}

#content form.change-username .text-wrapper input,
#content form.fill-profile .text-wrapper input,
#content form.change-password .text-wrapper input {
    width: 230px;
    padding-left: 10px;
    _line-height: 30px;
    _height: 30px;
}

#content form.change-email .text-wrapper input {
    width: 400px;
    padding: 0 10px;
    _line-height: 30px;
    _height: 30px;
}

#content form.change-avatar div.tr {
    height: 100px;
}

#content form.change-avatar div.th {
    height: 100px;
    position: relative;
    width: 120px;
}

#content form.change-avatar div.td {
    position: relative;
}

#content form.change-avatar .avatar-mask-100 {
    background: url("/static/img/avatar_masks.png") 0 -130px;
    height: 100px;
    left: 0px;
    position: absolute;
    top: 0px;
    width: 100px;
}

#content form.change-avatar div.td .text {
    color: #999999;
    font-size: 14px;
    height: 18px;
    line-height: 18px;
    padding: 40px 0 10px 0;
}

#content form.change-avatar div.td input.avatar-file {
    -moz-opacity: 0;
    filter: alpha(opacity: 0);
    opacity: 0;
    cursor: pointer;
    height: 24px;
    left: 0px;
    position: absolute;
    top: 0px;
    width: 84px;
    z-index: 100;
    _left: -5px;
    _border: medium none;
}

#content form.change-avatar div.td .fake-file {
    cursor: pointer;
    height: 24px;
    left: 0px;
    position: absolute;
    top: 8px;
    width: 84px;
}

#content form.change-avatar div.td .fake-button {
    background: #4abdcc;
    color: #ffffff;
    cursor: pointer;
    height: 24px;
    left: 0px;
    line-height: 24px;
    position: absolute;
    text-align: center;
    top: 0px;
    width: 84px;
    z-index: 1;
}

#content form.change-avatar div.td .fake-file:hover .fake-button {
    background: #2e9dab;
}

#content form.change-avatar div.td .filename {
    color: #5c5c5c;
    height: 24px;
    left: 90px;
    line-height: 24px;
    position: absolute;
    top: 8px;
    _left: 100px;
}


/* Connect SNS page begin */
#content form.connect-sns div.sns-tile {
    background: #f7f7f7;
    float: left;
    height: 103px;
    margin: 0 20px 20px 0;
    padding: 25px;
    width: 209px;
}

#content form.connect-sns div.row {
    clear: both;
    color: #999999;
    font-size: 14px;
    line-height: 23px;
    margin-bottom: 15px;
    text-align: center;
}

#content form.connect-sns div.row .text {
    display: inline-block;
    height: 23px;
    padding-left: 28px;
    _float: left;
    _margin-left: 22px;
}

#content form.connect-sns div.row .sina-icon {
    background: url("/static/img/settings_icons.png") no-repeat 0 0;
}

#content form.connect-sns div.row .tencent-icon {
    background: url("/static/img/settings_icons.png") no-repeat 0 -25px;
}

#content form.connect-sns div.row .renren-icon {
    background: url("/static/img/settings_icons.png") no-repeat 0 -50px;
}
/* Connect SNS page end */

/* Notification page begin */
#content form.notification div.title {
    color: #5c5c5c;
    font-size: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid #eaeaea;
}

#content form.notification .topic-space {
    height: 52px;
}

#content form.notification .item {
    color: #5c5c5c;
    font-size: 14px;
    padding: 20px 0 9px 0;
}

#content form.notification .item input {
    margin-right: 20px;
}

#content form.notification .save {
    background: #4abdcc;
    border: 0px solid transparent;
    color: #ffffff;
    cursor: pointer;
    font-size: 14px;
    height: 32px;
    margin: 21px 0 30px 0;
    text-shadow: 1px 1px 1px #5c5c5c;
    width:96px;
}

#content form.notification .save:hover {
    background: #2e9dab;
}
/* Notification page end */

.connect-sns-tip{
    font-size: 14px;
    color: #999;
    margin-bottom: 5px;
}
.connect-sns-list{
    width: 510px;
}
.connect-sns-list li{
    padding: 20px 0;
    border-top: 1px solid #e7e7e7;
}
.connect-sns-list li:first-child{
    border-top: none;
}
.connect-sns-list li.connected{
    height: 100px;
}
.connect-sns-btn{
    display: block;
    height: 58px;
    line-height: 58px;
    background-image: url('/static/img/settings_sns_icon.png');
    background-repeat: no-repeat;
    padding-left: 72px;
}
.connect-sns-sina .connect-sns-btn,
.connect-sns-sina .connect-sns-detail {
    background-position: 0 0;
}
.connect-sns-sina .connect-sns-btn:hover{
    background-position: 0 -59px;
}
.connect-sns-tencent .connect-sns-btn,
.connect-sns-tencent .connect-sns-detail {
    background-position: 0 -118px;
}
.connect-sns-tencent .connect-sns-btn:hover{
    background-position: 0 -177px;
}
.connect-sns-renren .connect-sns-btn,
.connect-sns-renren .connect-sns-detail {
    background-position: 0 -236px;
}
.connect-sns-renren .connect-sns-btn:hover{
    background-position: 0 -295px;
}
input.contect-sns-save{
    background: #4abdcc;
    border: none;
    /*border-bottom: 2px solid #2e9dab;*/
    /*border-radius: 3px;*/
    color: #ffffff;
    cursor: pointer;
    display: inline-block;
    *display: inline;
    *zoom: 1;
    font-size: 14px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    text-shadow: 0px 2px 0px #2e9dab;
    width: 110px;
    padding: 0;
    margin-top: 6px;
}
input.contect-sns-save:hover{
    background: #2e9dab;
    /*border-bottom: 2px solid #168391;*/
    text-shadow: 0px 2px 0px #168391;
}
.contect-sns-note{
    color: #4abdcc;
    margin-left: 20px;
    font-size: 14px;
}
.connect-sns-detail{
    height: 58px;
    background: url('/static/img/settings_sns_icon.png') 0 0 no-repeat;
    padding-left: 72px;
    color: #999;
}
.connect-sns-detail .connect-sns-remove{
    margin-left: 20px;
}
.connect-sns-detail p{
    font-size: 14px;
    padding: 5px 0;
    line-height: 20px;
}
.connect-sns-detail span{
    margin-right: 16px;
    line-height: 20px;
    position: relative;
    overflow: hidden;
}
.connect-sns-detail span > input{
    padding: 0;
    margin: 0;
    height: 20px;
    width: 20px;
    float: left;
    position: absolute;
    left: 0;
    opacity: 0;
}
.connect-sns-detail span label{
    cursor: pointer;
}
.connect-sns-detail span > label{
    line-height: 20px;
    padding: 2px 0 3px 22px;
    -moz-transition: color 1s ease;
    -o-transition: color 1s ease;
    -webkit-transition: color 1s ease;
    transition: color 1s ease;
}
.connect-sns-detail span:not(#ie8) > input[type=checkbox] + label {
    background: url('/static/img/settings_checkbox.png') 0 -21px no-repeat;
    height: 20px;
}
.connect-sns-detail span:not(#ie8) > input[type=checkbox]:checked + label{
    background-position: 0 0px;
}

.connect-sns-popup dd{
    text-align: left;
    overflow: hidden;
    padding-left: 14px;
    font-size: 14px;
}

.connect-sns-popup dd p{
    line-height: 20px;
    padding: 4px 0;
}

.connect-sns-popup dd span{
    display: inline-block;
    *display: inline;
    *zoom: 1;
    width: 100px;
    line-height: 20px;
    position: relative;
    overflow: hidden;
}

.connect-sns-popup span > input{
    padding: 0;
    margin: 0;
    height: 20px;
    width: 20px;
    float: left;
    position: absolute;
    left: 0;
    opacity: 0;
}
.connect-sns-popup span > label{
    line-height: 20px;
    padding: 2px 0 3px 22px;
    -moz-transition: color 1s ease;
    -o-transition: color 1s ease;
    -webkit-transition: color 1s ease;
    transition: color 1s ease;
}
.connect-sns-popup span:not(#ie8) > input[type=checkbox] + label {
    background: url('/static/img/settings_checkbox.png') 0 -21px no-repeat;
    height: 20px;
}
.connect-sns-popup span:not(#ie8) > input[type=checkbox]:checked + label{
    background-position: 0 0px;
}
